<template>
    <div
    class="box"
    >
        <el-row :gutter="20">
            <el-col :span="6">
                <CardOfStore
                @flush="flush"
                @select="goodsStoreSelect"
                />
            </el-col>
            <el-col :span="18">
                <CardOfEmp 
                ref="cardOfEmp"
                />
            </el-col>

        </el-row>
    </div>
</template>

<script lang="ts" setup>
import { ref } from 'vue';
import $kt from '@/vueKantboot';
import { ElMessage, ElMessageBox } from 'element-plus';
import CardOfStore from './components/GoodsStore/CardBody.vue';
import CardOfEmp from './components/GoodsEmp/CardBody.vue';

let cardOfEmp = ref();

let goodsStoreSelect = (param: any) => {
    console.log(param);
    cardOfEmp.value.toSelectGoodsStore(param);
}


let flush = () => {
    cardOfEmp.value.flush();
}

</script>

<style lang="scss" scoped>
.box {
    padding: 20px 20px 0 20px;
    min-width: 700px;
}

.box-box {
    background-color: #fff;
    color: #fff;
    text-align: center;
    padding: 30px;
    border-radius: 5px;
}


.box-box:hover {
    // 变小
    transform: scale(0.95);
}

.box-box:active {
    // 变小
    transform: scale(0.9);
}
</style>